<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>bom-window</title>
</head>

<body>
  <button>按钮</button>

  <script>
    /*
      bom - browser object model, 浏览器对象模型
 
      一共分为:
      window        窗口对象,浏览器最大对象,包含了其他所有的bom对象
 
      history       历史对象,包含浏览器访问历史相关信息
      navigator     导航对象,包含浏览器各种相关信息参数
      location      地址对象,包含浏览器url地址栏中的信息
      screen        屏幕对象,包含浏览器屏幕信息
    */

    /* 
      window对象
      
      属性:
      history,navigator,location,screen...innerWidth/innerHeight,outerWidth/outerHeight

      函数:
      alert(),confirm(),prompt(),close(),focus(),blur()...

      定时器相关函数(参见57号案例)
      setInterval()/clearInterval(),setTimeout()/clearTimeout()


      注意: 实际使用中window一般都省略不写!!!
    */
    //const btn = window.document.querySelector('button')
    //console.log(btn);
    //window.alert('警告弹出框')

    console.log(window.innerWidth, window.innerHeight);//返回窗口的文档显示区的宽度和高度
    console.log(window.outerWidth, window.outerHeight);//返回窗口的外部宽度和高度，包含工具条与滚动条。


  </script>
</body>

</html>